import {css} from 'styled-components';

export const textEllipsis = css`
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
`;

export function multiLineTextEllipsis(line: number) {
  return css`
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: ${line};
    -webkit-box-orient: vertical;
  `;
}

export function placeholder(color: string) {
  return css`
    ::-moz-placeholder {
      color: ${color};
      opacity: 1;
    }
    :-ms-input-placeholder {
      color: ${color};
    }
    ::-webkit-input-placeholder {
      color: ${color};
    }
  `;
}

export const hideScrollbar = css`
  ::-webkit-scrollbar {
    display: none;
  }
  -ms-overflow-style: none;
`;
